<template>
  <!-- 案件分配，分配模式 -->
  <section class="component distribution-pattern">
    <el-select v-model="parrentType" class="types" :disabled="isDisabled">
      <el-option v-for="(item,index) of patternCollection" :key="index" :label="item.name" :value="index"></el-option>
    </el-select>
    <el-radio-group v-model="selectedType" class="patterns" :disabled="isDisabled">
      <el-radio v-for="(parrent,index) of patternCollection[parrentType].patterns" :key="index" :label="parrent.value">{{parrent.name}}</el-radio>
    </el-radio-group>
  </section>
</template>
<script lang="ts">
import Vue from 'vue';
import Component from 'vue-class-component';
import { Prop, Emit, Watch, Model } from 'vue-property-decorator';
import { DISTRIBUTION_TYPE } from "~/config/enum.config";

@Component({
  components: {},
})
export default class DistributionPattern extends Vue {
  @Model('on-select-change')
  private sType;

  private patternCollection = DISTRIBUTION_TYPE;
  // 分配模式 默认为第一种方式 否则加载不出来任何数据
  private parrentType = 0;
  @Prop()
  private isDisabled:any
  @Emit('on-select-change')
  private emitOnSelectChange(val) { }

  private get selectedType() {
    return this.sType;
  }
  private set selectedType(val) {
    this.emitOnSelectChange(val);
  }
}
</script>
<style lang="less" scoped>
.component.distribution-pattern {
  padding-left: 10px;
  margin-bottom: 10px;
  .types {
    width: 140px;
  }
  .patterns {
    padding-left: 40px;
    line-height: inherit!important;
  }
}
</style>
